<template>
  <div class="app-container">
    <el-form
      ref="objectForm"
      :model="object"
      :rules="objectRules"
      label-width="150px">
      <el-row>
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">基本信息</div>
          </el-col>
        </el-row>
        <el-row class="mt-20">
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="楼旁名称："
                prop="buildingName">
                <el-input v-model="object.buildingName"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item label="发布状态：">
                <el-select
                  v-model="object.status"
                  placeholder="发布状态"
                  style="width: 100%;"
                  clearable >
                  <el-option
                    v-for="(item, index) in GLOBAL.status"
                    :key="index"
                    :label="item"
                    :value="index+''"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="span"/>
          </el-row>
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item label="城市：">
                <el-input v-model="object.cityName"/>
              </el-form-item>
              <!-- <el-form-item label="城市">
              <el-select v-model="object.cityName" placeholder="城市" >
                <el-option v-for="(item, index) in informationTypes" :key = "index" :label= "item.object.name" :value="item.id"/>
              </el-select>
            </el-form-item> -->
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="楼盘地址："
                prop="address">
                <el-input v-model="object.address"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item label="占地面积：">
                <el-input v-model="object.areaCovered"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
      </el-row>
      <el-row>
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">销售信息</div>
          </el-col>
        </el-row>
        <el-row class="mt-20">
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="楼盘状态："
                prop="buildingStatus">
                <el-select
                  v-model="object.buildingStatus"
                  placeholder="发布"
                  style="width: 100%;"
                  clearable >
                  <el-option
                    v-for="(item, index) in GLOBAL.buildingStatus"
                    :key="index"
                    :label="item"
                    :value="index+1"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="售楼地址："
                prop="salesAddress">
                <el-input v-model="object.salesAddress"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="交房时间："
                prop="deliveryTime">
                <el-date-picker
                  :span="8"
                  v-model="object.deliveryTime"
                  style="width: 100%;"
                  value-format="yyyy-MM-dd"
                  type="date"
                  placeholder="交房时间"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="售楼电话："
                prop="salesPhone">
                <el-input v-model="object.salesPhone"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="产权年限："
                prop="">
                <el-input v-model="object.ownershipYears"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="开发商："
                prop="">
                <el-input v-model="object.developers"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="销售价格："
                prop="sellingPrice">
                <el-input v-model="object.sellingPrice">
                  <template slot="append">/平米</template>
                </el-input>
              </el-form-item>

            </el-col>
            <el-col :span="span"/>
            <el-col :span="span"/>
          </el-row>
        </el-row>
      </el-row>
      <el-row>
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">小区概况</div>
          </el-col>
        </el-row>
        <el-row class="mt-20">
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="供电方式："
                prop="powerSupplyMode">
                <el-input v-model="object.powerSupplyMode"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="容积率："
                prop="">
                <el-input v-model="object.plotRatio"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="绿化率："
                prop="">
                <el-input v-model="object.greeningRate"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="gutter">
            <el-col :span="span">
              <el-form-item
                label="物业公司："
                prop="propertyCompany">
                <el-input v-model="object.propertyCompany"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="物业类型："
                prop="propertyType">
                <el-input v-model="object.propertyType"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="供暖方式："
                prop="heatingMode">
                <el-input v-model="object.heatingMode"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="gutter">
            <el-col >
              <el-form-item label="车位数量 ：" prop="aboveGround"/>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="地上："
                prop="aboveGround">
                <el-input v-model="object.parkingSpacesNumber.aboveGround"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="地下："
                prop="underGround">
                <el-input v-model="object.parkingSpacesNumber.underGround"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="车位比："
                prop="parkingSpaceRatio">
                <el-input v-model="object.parkingSpacesNumber.parkingSpaceRatio"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="gutter">
            <el-col >
              <el-form-item label="物业费用 ：" prop="aboveGround"/>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="高层："
                prop="highLevel">
                <el-input v-model="object.propertyCost.highLevel"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="洋房："
                prop="villa">
                <el-input v-model="object.propertyCost.villa"/>
              </el-form-item>
            </el-col>
            <el-col :span="span">
              <el-form-item
                label="LOFT："
                prop="LOFT">
                <el-input v-model="object.propertyCost.LOFT"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
      </el-row>
      <!--户型信息-->
      <el-row :gutter="24">
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">户型信息</div>
          </el-col>
          <el-col
            :span="12"
            class="text-right">
            <el-button
              icon="el-icon-circle-plus-outline"
              class="border-4C7FD7 color-4C7FD7"
              style="padding: 5px 10px;"
              @click="showBuildingDialog(1)">新增</el-button>
          </el-col>
        </el-row>
        <el-row class="mt-15">
          <el-table
            :data="object.houseTypeInformation"
            :header-cell-style="{background:'#F1F3F5',color:'#666666'}"
            border
            fit
            highlight-current-row
            style="width: 100%">
            <el-table-column
              align="center"
              label="户型名称">
              <template slot-scope="scope">
                <span>{{ scope.row.houseTypeName }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="建筑面积（㎡）">
              <template slot-scope="scope">
                <span>{{ scope.row.builtUpArea }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="朝向">
              <template slot-scope="scope">
                <span>{{ scope.row.orientation }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="层高">
              <template slot-scope="scope">
                <span>{{ scope.row.storeyHeight }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="户型结构">
              <template slot-scope="scope">
                <span>{{ scope.row.houseStructure }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="总价">
              <template slot-scope="scope">
                <span>{{ scope.row.totalPrice }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="户型业态">
              <template slot-scope="scope">
                <span>{{ scope.row.businessType }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="居室">
              <template slot-scope="scope">
                <span>{{ scope.row.housewearFurnishings }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="户型分析">
              <template slot-scope="scope">
                <span>{{ scope.row.analysisHouse }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="操作"
              width="65">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  @click="removeBuildingInfo(1, scope.$index)">编辑</el-button>
                <el-button
                  type="text"
                  @click="removeBuildingInfo(1, scope.$index)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
      </el-row>
      <!--楼盘亮点-->
      <el-row
        :gutter="24"
        class="mt-20">
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">楼盘亮点</div>
          </el-col>
          <el-col
            :span="12"
            class="text-right">
            <el-button
              icon="el-icon-circle-plus-outline"
              class="border-4C7FD7 color-4C7FD7"
              style="padding: 5px 10px;"
              @click="showBuildingDialog(2)">新增</el-button>
          </el-col>
        </el-row>
        <el-row class="mt-15">
          <el-table
            :data="object.realEstateHighLights"
            :header-cell-style="{background:'#F1F3F5',color:'#666666'}"
            border
            fit
            highlight-current-row
            style="width: 100%">
            <el-table-column
              align="center"
              label="亮点名称">
              <template slot-scope="scope">
                <span> {{ scope.row.highlightName }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="亮点描述">
              <template slot-scope="scope">
                <span> {{ scope.row.highlightDesc }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="操作"
              width="65">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  @click="removeBuildingInfo(2, scope.$index)">删除</el-button>
                <el-button
                  type="text"
                  @click="removeBuildingInfo(2, scope.$index)">编辑</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
      </el-row>
      <!--楼盘相册-->
      <el-row
        :gutter="24"
        class="mt-20">
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">楼盘相册</div>
          </el-col>
          <el-col
            :span="12"
            class="text-right">
            <el-button
              icon="el-icon-circle-plus-outline"
              class="border-4C7FD7 color-4C7FD7"
              style="padding: 5px 10px;"
              @click="showBuildingDialog(3)">新增</el-button>
          </el-col>
        </el-row>
        <el-row class="mt-15">
          <el-table
            :data="object.propertyAlbum"
            :header-cell-style="{background:'#F1F3F5',color:'#666666'}"
            border
            fit
            highlight-current-row
            style="width: 100%">
            <el-table-column
              align="center"
              label="图片名称">
              <template slot-scope="scope">
                <span> {{ scope.row.pictureName }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="图片分类">
              <template slot-scope="scope">
                <span> {{ scope.row.pictureClassification }}</span>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="操作"
              width="100">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  @click="removeBuildingInfo(3, scope.$index)">编辑</el-button>
                <el-button
                  type="text"
                  @click="removeBuildingInfo(3, scope.$index)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
      </el-row>
      <!--项目楼书-->
      <el-row
        :gutter="24"
        class="mt-20">
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">项目楼书</div>
          </el-col>
          <el-col
            :span="12"
            class="text-right"/>
        </el-row>
        <el-row class="mt-15">
          <el-upload
            :action="GLOBAL.uploadFile"
            :on-success="handleSuccess"
            :file-list="fileList"
            :limit="1"
            class="upload-demo"
          >
            <el-button
              size="small"
              type="primary">点击上传</el-button>
            <div
              slot="tip"
              class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
          </el-upload>
        </el-row>
      </el-row>
      <!--添加标签-->
      <el-row
        :gutter="24"
        class="mt-20">
        <el-row>
          <el-col :span="12">
            <div
              style="border-left: 4px solid #4C7FD7; padding-left: 18px;margin-top: 5px"
              class="font16 color-333">添加标签</div>
          </el-col>
          <el-col
            :span="12"
            class="text-right"/>
        </el-row>
        <el-row class="mt-15">
          <el-tag
            v-for="(tag, index) in object.tag"
            :key="index"
            :disable-transitions="false"
            closable
            @close="handleClose(index)">
            {{ tag.name }}
          </el-tag>
          <el-input
            v-if="inputVisible"
            ref="saveTagInput"
            v-model="tagValue"
            class="input-new-tag"
            size="small"
            @keyup.enter.native="handleInputConfirm"
            @blur="handleInputConfirm"
          />
          <el-button
            v-else
            size="small"
            @click="showInput">添加标签</el-button>
        </el-row>
      </el-row>
    </el-form>
    <div
      class="gpo-btn text-center p30 mt-20"
      style="padding-top: 20px">
      <el-button
        :loading="btnLoading"
        type="primary"
        size="big"
        style="width: 120px;"
        @click="onSubmit(message)">保存</el-button>
      <el-button
        style="width: 120px;"
        size="big"
        @click="onBack">返回</el-button>
    </div>
    <!-- 户型信息 -->
    <el-dialog
      :visible.sync="dialogFormVisible1"
      title="户型信息"
      width="850px">
      <el-form
        ref="objectForm"
        :model="houseTypeInformation"
        :rules="objectRules"
        label-width="110px">
        <el-row>
          <el-form-item
            label="户型图："
            prop="videoCover">
            <single-image
              :images="fileList"
              :time="false"
              @success="setFloorImage"/>
          </el-form-item>
          <el-form-item
            label="户型名称："
            prop="houseTypeName">
            <el-input v-model="houseTypeInformation.houseTypeName"/>
          </el-form-item>
          <el-form-item
            label="户型面积："
            prop="builtUpArea">
            <el-input v-model="houseTypeInformation.builtUpArea"/>
          </el-form-item>
          <el-form-item
            label="朝向："
            prop="orientation">
            <el-input v-model="houseTypeInformation.orientation"/>
          </el-form-item>
          <el-form-item
            label="层高："
            prop="storeyHeight">
            <el-input v-model="houseTypeInformation.storeyHeight"/>
          </el-form-item>
          <el-form-item
            label="户型结构："
            prop="houseStructure">
            <el-input v-model="houseTypeInformation.houseStructure"/>
          </el-form-item>
          <el-form-item
            label="总价："
            prop="totalPrice">
            <el-input v-model="houseTypeInformation.totalPrice"/>
          </el-form-item>
          <el-form-item
            label="户型业态："
            prop="businessType">
            <el-input v-model="houseTypeInformation.businessType"/>
          </el-form-item>
          <el-form-item
            label="居室："
            prop="housewearFurnishings">
            <el-input v-model="houseTypeInformation.housewearFurnishings"/>
          </el-form-item>
          <el-form-item
            label="户型分析："
            prop="analysisHouse">
            <el-input v-model="houseTypeInformation.analysisHouse"/>
          </el-form-item>
        </el-row>
      </el-form>
      <div
        slot="footer"
        class="dialog-footer">
        <el-button @click="dialogFormVisible1 = false">取 消</el-button>
        <el-button
          :loading="btnLoading"
          type="primary"
          @click="addBuildingInfo(1)">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 楼盘亮点 -->
    <el-dialog
      :visible.sync="dialogFormVisible2"
      title="楼盘亮点"
      width="450px">
      <el-form
        ref="objectForm"
        :model="realEstateHighLights"
        :rules="objectRules"
        label-width="110px">
        <el-row>
          <el-form-item
            label="图片："
            prop="pictureName">
            <single-image
              :images="fileList1"
              :time="false"
              @success="setHightImage"/>
          </el-form-item>
          <el-form-item
            label="亮点名称："
            prop="highlightName">
            <el-input v-model="realEstateHighLights.highlightName"/>
          </el-form-item>
          <el-form-item
            label="亮点描述："
            prop="highlightDesc">
            <el-input
              v-model="realEstateHighLights.highlightDesc"
              type="textarea"
              row="4"/>
          </el-form-item>
        </el-row>
      </el-form>
      <div
        slot="footer"
        class="dialog-footer">
        <el-button @click="dialogFormVisible2 = false">取 消</el-button>
        <el-button
          :loading="btnLoading"
          type="primary"
          @click="addBuildingInfo(2)">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 楼盘相册 -->
    <el-dialog
      :visible.sync="dialogFormVisible3"
      title="楼盘相册"
      width="850px">
      <el-form
        ref="objectForm"
        :model="propertyAlbum"
        :rules="objectRules"
        label-width="110px">
        <el-row>
          <el-form-item
            label="图片："
            prop="pictureName">
            <single-image
              :images="fileList2"
              :time="false"
              @success="setPictureImage"/>
          </el-form-item>
          <el-form-item
            label="图片名称："
            prop="pictureName">
            <el-input v-model="propertyAlbum.pictureName"/>
          </el-form-item>
          <el-form-item
            label="图片分类："
            prop="pictureClassification">
            <el-input v-model="propertyAlbum.pictureClassification"/>
          </el-form-item>
        </el-row>
      </el-form>
      <div
        slot="footer"
        class="dialog-footer">
        <el-button @click="dialogFormVisible3 = false">取 消</el-button>
        <el-button
          :loading="btnLoading"
          type="primary"
          @click="addBuildingInfo(3)">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import mixin from './rules/building.js'
import SingleImage from '@/components/Upload/singleImage'
export default {
  name: 'Cratebuilding',
  components: { SingleImage },
  mixins: [mixin],
  data() {
    return {
      message: '新增楼盘',
      gutter: 20,
      span: 8,
      dialogFormVisible1: false,
      dialogFormVisible2: false,
      dialogFormVisible3: false,
      inputVisible: false,
      tagValue: '',
      fileList: [], // 户型图
      fileList1: [], // 楼盘相册
      fileList2: [], // 楼盘相册
      object: {
        'buildingName': '',
        'status': '',
        'cityName': '',
        'address': '',
        'areaCovered': '',
        'buildingStatus': '',
        'salesAddress': '',
        'deliveryTime': '',
        'salesPhone': '',
        'ownershipYears': '',
        'developers': '',
        'sellingPrice': 0,
        'powerSupplyMode': '',
        'plotRatio': '',
        'greeningRate': '',
        'propertyCompany': '',
        'propertyType': '',
        'heatingMode': '',
        'parkingSpacesNumber': {
          'aboveGround': '',
          'underGround': '',
          'parkingSpaceRatio': ''
        },
        'propertyCost': {
          'highLevel': '',
          'villa': '',
          'LOFT': ''
        },
        'thumbnail': '',
        'houseTypeInformation': [],
        'realEstateHighLights': [], // 楼盘亮点
        'propertyAlbum': [],
        'tag': [],
        'projectBuilding': '',
        'level': 'building'
      },
      realEstateHighLights: {
        'highlightName': '',
        'highlightDesc': '',
        'serialNumber': '',
        'pictureList': []
      },
      houseTypeInformation: {
        'serialNumber': '',
        'houseTypeName': '',
        'builtUpArea': '',
        'orientation': '',
        'storeyHeight': '',
        'houseStructure': '',
        'totalPrice': '',
        'businessType': '',
        'analysisHouse': '',
        'floorPlan': [],
        'housewearFurnishings': ''
      },
      propertyAlbum: {
        'serialNumber': '',
        'pictureList': [],
        'pictureName': '',
        'pictureClassification': ''
      }
    }
  },
  //   mounted(){
  //  // 初始化
  //     this.searchList()
  //     // 初始化分类内容
  //     let query = {
  //       level: 'area',
  //       city:'',
  //       status:'',
  //       pageSize: 10,
  //       pageNum: 1
  //     }
  //     query = this.setListQuery(query)
  //     this.searchListAll(query).then((res) => {
  //       this.informationTypes = res.data.list
  //     })
  //   },
  created() {
    if (this.$route.params.id) {
      this.message = '修改楼盘'
      this.getDateById(this.$route.params.id)
    }
    // 清空
    this.houseTypeInformationCopy = this._.cloneDeep(this.houseTypeInformation)
    this.realEstateHighLightsCopy = this._.cloneDeep(this.realEstateHighLights)
    this.propertyAlbumCopy = this._.cloneDeep(this.realEstateHighLights)
  },
  methods: {
    async init() {
    },
    showBuildingDialog(type) {
      switch (type) {
        case 1 :
          this.houseTypeInformation = this._.cloneDeep(this.houseTypeInformationCopy)
          this.dialogFormVisible1 = true
          break
        case 2 :
          this.realEstateHighLights = this._.cloneDeep(this.realEstateHighLightsCopy)
          this.dialogFormVisible2 = true
          break
        case 3 :
          this.propertyAlbum = this._.cloneDeep(this.propertyAlbumCopy)
          this.dialogFormVisible3 = true
          break
      }
    },
    // 新增消息
    addBuildingInfo(type) {
      switch (type) {
        case 1 :
          this.object.houseTypeInformation.push(this.houseTypeInformation)
          this.dialogFormVisible1 = false
          break
        case 2 :
          this.object.realEstateHighLights.push(this.realEstateHighLights)
          this.dialogFormVisible2 = false
          break
        case 3 :
          this.object.propertyAlbum.push(this.propertyAlbum)
          this.dialogFormVisible3 = false
          break
      }
    },
    // 删除
    removeBuildingInfo(type, index) {
      switch (type) {
        case 1 :
          this.object.houseTypeInformation.splice(index, 1)
          break
        case 2 :
          this.object.realEstateHighLights.splice(index, 1)
          break
        case 3 :
          this.object.propertyAlbum.splice(index, 1)
          break
      }
    },
    // 文件上传
    handleSuccess() {
    },
    // 新增标签
    handleClose(index) {
      this.object.tag.splice(index, 1)
    },
    showInput() {
      this.inputVisible = true
      this.$nextTick(_ => {
        this.$refs.saveTagInput.$refs.input.focus()
      })
    },
    handleInputConfirm() {
      const tagValue = this.tagValue
      if (tagValue) {
        this.object.tag.push({
          name: tagValue
        })
      }
      this.inputVisible = false
      this.tagValue = ''
    },
    // 上传多图
    setFloorImage(file) {
      const _this = this
      if (file.length === 0) {
        this.houseTypeInformation.floorPlan = []
        return
      }
      this._.forEach(file, function(f) {
        _this.houseTypeInformation.floorPlan.push(
          {
            url: f.imgUrl
          }
        )
      })
    },
    // 上传多图
    setHightImage(file) {
      const _this = this
      if (file.length === 0) {
        this.realEstateHighLights.pictureList = []
        return
      }
      this._.forEach(file, function(f) {
        _this.realEstateHighLights.pictureList.push(
          {
            url: f.imgUrl
          }
        )
      })
    },
    // 上传多图
    setPictureImage(file) {
      const _this = this
      if (file.length === 0) {
        this.propertyAlbum.pictureList = []
        return
      }
      this._.forEach(file, function(f) {
        _this.propertyAlbum.pictureList.push(
          {
            url: f.imgUrl
          }
        )
      })
    }
  }
}
</script>

<style>
    .el-tag + .el-tag {
        margin-left: 10px;
    }
    .button-new-tag {
        margin-left: 10px;
        height: 32px;
        line-height: 30px;
        padding-top: 0;
        padding-bottom: 0;
    }
    .input-new-tag {
        width: 90px;
        margin-left: 10px;
        vertical-align: bottom;
    }
</style>
